<!DOCTYPE html>
<html>

<head>
    <title>BootstrapValidator demo</title>

    <!-- <link rel="stylesheet" href="../vendor/bootstrap/css/bootstrap.css"/>
    <link rel="stylesheet" href="../dist/css/bootstrapValidator.css"/> -->

    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
    <!-- <script type="text/javascript" src="../js/plugins/validate/bootstrapValidator.js"></script> -->
    <script src="https://cdn.bootcss.com/bootstrap-validator/0.5.3/js/bootstrapValidator.js"></script>
</head>

<body>
    <form id="form" method="post" class="form-horizontal">
        <div class="form-group">
            <label class="col-sm-2 control-label">Username</label>
            <div class="col-sm-5">
                <input type="text" class="form-control" name="username" />
            </div>
            <button type="button" onclick="v()" class="btn btn-primary">
                Submit
            </button>
        </div>
        <!-- <div class="form-group">
            <div class="col-sm-10 col-sm-offset-2">
                <button type="button" class="btn btn-primary">Submit</button>
            </div>
        </div> -->
    </form>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#form').bootstrapValidator({
                message: 'This value is not valid',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                //group: '.form-group',
                fields: {
                    username: {
                        message: 'The username is not valid',
                        validators: {
                            notEmpty: {
                                message: 'The username is required and cannot be empty'
                            },
                            regexp: {
                                regexp: /^[a-zA-Z0-9_\.]+$/,
                                message: ''
                            },
                        }
                    }
                }
            });
        });
        $('#form').data('bootstrapValidator').validate();
        function v() {
            //alert($('#form').isValid);  
            //alert(isValidContainer($('#form')));
            //开启验证
            $('#form').data('bootstrapValidator').validate();
            //是否通过校验
            if (!$('#form').data('bootstrapValidator').isValid()) {
                //没有通过校验 
                console.log(0);

            } else {
                //通过校验，可进行提交等操作
                console.log(1);
            }
        }
    </script>
</body>

</html>